/**
 * 创建短信校验对话框
 * 
 * @returns
 */
function createDialog() {
	// 遮罩层
	var $shadow = $("<div></div>");
	// 对话框
	var $dialog = $('<div></div>');

	// 遮罩层样式
	$shadow.css({
		position : 'fixed',
		left : '0',
		top : '0',
		right : '0',
		bottom : '0',
		width : '100%',
		heiht : '100%',
		background : "#000",
		opacity : '0.3',
		'z-index':999
	});

	// 遮罩层点击事件
	$shadow.bind('click', function(event) {
		event.stopPropagation();
		// $dialog.trigger('close-dialog');
	});

	// 对话框样式
	var bodyWidth = $('body').width();
	var bodyHeight = $('body').height();
	var dialogLeft = (bodyWidth - 460) / 2;
	var dialogTop = (bodyHeight - 226) / 2;
	$dialog.css({
		position : 'fixed',
		top : dialogTop,
		left : dialogLeft,
		width : '460px',
		height : '226px',
		background : '#fff',
		opacity : '1',
		'z-index':999
	});

	// 窗口发生变化时,对话框位置同样变化
	$(window).resize(function() {
		var bodyWidth = $('body').width();
		var bodyHeight = $('body').height();
		var dialogLeft = (bodyWidth - 460) / 2;
		var dialogTop = (bodyHeight - 226) / 2;
		$dialog.css({
			position : 'fixed',
			top : dialogTop,
			left : dialogLeft,
			width : '460px',
			height : '226px',
			background : '#fff',
			opacity : '1'
		});
	});

	// 屏蔽对话框点击事件传递
	$dialog.bind('click', function(event) {
		event.stopPropagation();
	});

	// 自定义绑定事件
	$dialog.bind('close-dialog', function() {
		$dialog.remove();
		$shadow.remove();
	});

	// 遮罩层加入
	$('body').append($shadow);
	// 对话框加入
	$('body').append($dialog);

	return $dialog;
}

/**
 * 短信校验对话框构建内容
 * 
 * @param successFunc
 *            校验成功后调用
 * @param failtureFunc
 *            取消校验后调用
 */
function showSecurityProtectDialog(mobile, successFunc, failtureFunc) {
	var $dialog = createDialog();
	$dialog.css({
		'border' : '1px solid #ccc'
	})

	var $dialogTitleBar = $("<div></div>");
	$dialogTitleBar.css({
		'width' : '100%',
		'height' : '48px',
		'line-height' : '48px',
		'font-size' : '18px',
		'font-weight' : '500',
		'margin' : '0 0 0',
		'padding' : '0 0 0',
		'border-bottom' : '1px solid #ccc'
	});
	$dialog.append($dialogTitleBar);

	// Title-文字
	var $dialogTitle = $('<span>短信验证</span>');
	$dialogTitleBar.append($dialogTitle);
	$dialogTitle.css({
		'padding-left' : '24px'
	});

	// Title-ClaseButton
	var $dialogTitleCloseButton = $('<span><span>');
	$dialogTitleBar.append($dialogTitleCloseButton);
	$dialogTitleCloseButton.css({
		'position' : 'absolute',
		'width' : '18px',
		'height' : '18px',
		'cursor' : 'pointer',
		'top':'16px',
		'right' : '16px',
		'overflow':'hidden',
		'border':'none'
	});
	var $buttonImg = $("<img src=\'css/img/delete-icon.png\'/>");
	$dialogTitleCloseButton.append($buttonImg);
	$buttonImg.css({
		'margin-top':'-2px',
		'margin-left':'-2px'
	});
	
	$dialogTitleCloseButton.bind('click', function(event) {
		event.stopPropagation();
		if (failtureFunc) {
			try {
				failtureFunc();
			} catch (err) {
				console.log(err);
			}
		}
		$dialog.trigger('close-dialog');
	});

	// 正文
	var $dialogContent = $('<div></div>');
	$dialog.append($dialogContent);
	$dialogContent.css({
		'width' : '100%',
		'padding-top' : '18px',
		'padding-bottom' : '18px',
		'border-bottom' : '1px solid #ccc'
	});

	// 第一行
	var $dialogContentRow_1 = $('<div></div>');
	$dialogContent.append($dialogContentRow_1);
	$dialogContentRow_1.css({

	});

	var $dialogContentColumn_1_1 = $('<div></div>');
	$dialogContentRow_1.append($dialogContentColumn_1_1);
	$dialogContentColumn_1_1.css({
		'display' : 'inline-block',
		'width' : '160px',
		'height' : '32px',
		'line-height' : '32px',
		'text-align' : 'right',
		'padding-right' : '4px'
	})
	$dialogContentColumn_1_1.append('您绑定的手机：');

	var $dialogContentColumn_1_2 = $('<div></div>');
	$dialogContentRow_1.append($dialogContentColumn_1_2);
	$dialogContentColumn_1_2.css({
		'display' : 'inline-block',
		'height' : '32px',
		'line-height' : '32px',
		'text-align' : 'left',
		'padding-left' : '4px'
	})
	$dialogContentColumn_1_2.append(mobile);

	// 第二行
	var $dialogContentRow_2 = $('<div></div>');
	$dialogContent.append($dialogContentRow_2);
	$dialogContentRow_2.css({
		'margin-top' : '12px',
	});

	var $dialogContentColumn_2_1 = $('<div></div>');
	$dialogContentRow_2.append($dialogContentColumn_2_1);
	$dialogContentColumn_2_1.css({
		'display' : 'inline-block',
		'width' : '160px',
		'text-align' : 'right',
		'padding-right' : '4px'
	});
	$dialogContentColumn_2_1.append('<span class=\'red\'>*</span> 验证码：');

	var $dialogContentColumn_2_2 = $('<div></div>');
	$dialogContentRow_2.append($dialogContentColumn_2_2);
	$dialogContentColumn_2_2.css({
		'display' : 'inline-block',
		'text-align' : 'left',
		'padding-left' : '4px'
	});

	var $verifyInput = $('<input type=\'text\' maxlength=\'6\' />');
	$verifyInput.css({
		'width' : '68px',
		'height' : '28px',
		'line-height' : '28px'
	});
	$dialogContentColumn_2_2.append($verifyInput);

	var $verifyButton = $('<input type=\'button\' value=\'获取验证码\'/>');
	$dialogContentColumn_2_2.append($verifyButton);
	var verifyButtonCss1 = {
		'width' : '120px',
		'height' : '32px',
		'line-height' : '28px',
		'margin-left' : '12px',
		'cursor' : 'pointer',
		'border' : '1px solid #C1C1C1',
		'background':'#E8E8E8',
		'color':'#666',
		'font-size':'14px',
		'text-align' : 'center',
		'text-decoration' : 'none',
		'display' : 'inline-block'
	};
	var verifyButtonCss2 = {
			'width' : '120px',
			'height' : '32px',
			'line-height' : '28px',
			'margin-left' : '12px',
			'cursor' : 'default',
			'border' : 'none',
			'background':'transparent',
			'color':'red',
			'font-size':'12px',
			'text-align' : 'center',
			'text-decoration' : 'none',
			'display' : 'inline-block'
		};
	$verifyButton.css(verifyButtonCss1);
	// 发送短信验证码
	$verifyButton.bind('click', function() {
		var _this = $(this);
		var verifyTimer;
		_this.blur();
		$.ajax({
			url : _SECURITY_PROTECT_VERIFY_URL,
			beforeSend : function(XMLHttpRequest) {
				var time = 60;
				verifyTimer = setInterval(function() {
					if (time < 0) {
						clearInterval(verifyTimer);
						$verifyButton.css(verifyButtonCss1);
						
						$verifyButton.val('获取验证码');
						$verifyButton.removeAttr('disabled');
					} else {
						$verifyButton.css(verifyButtonCss2);
						
						$verifyButton.attr('disabled', 'disabled');
						$verifyButton.val(time + '秒后重新获取');
						time--;
					}
				}, 1000);
				return true;
			},
			success : function(data, textStatus, XMLHttpRequest) {
				if (!(data && data.result)) {
					_alert('验证码发送失败，请稍候重试', false);
					
					clearInterval(verifyTimer);
					$verifyButton.css(verifyButtonCss1);
					
					$verifyButton.val('获取验证码');
					$verifyButton.removeAttr('disabled');
				}
			},
			error : function(XMLHttpRequest, textStatus, errorThrown) {
				_alert('验证码发送失败，请稍候重试', false);
				
				clearInterval(verifyTimer);
				$verifyButton.css(verifyButtonCss1);
				
				$verifyButton.val('获取验证码');
				$verifyButton.removeAttr('disabled');
			}
		});
	});

	// 操作按钮
	var $dialogFooter = $('<div></div>');
	$dialog.append($dialogFooter);
	$dialogFooter.css({
		'height' : '32px',
		'line-height' : '32px',
		'text-align' : 'right',
		'padding-top' : '12px',
		'padding-right' : '12px'
	});

	var $cancelButton = $('<input type=\'button\' value=\'取消\'/>');
	$cancelButton.css({
		'width' : '80px',
		'height' : '32px',
		'margin-right' : '12px',
		'border':'1px solid #C1C1C1',
		'color':'#383838',
		'background':'#fff'
	});
	// 取消按钮事件
	$cancelButton.on('click', function(event) {
		event.stopPropagation();
		if (failtureFunc) {
			try {
				failtureFunc();
			} catch (err) {
				console.log(err);
			}
		}
		$dialog.trigger('close-dialog');
	});

	var $okButton = $('<input type=\'button\' value=\'确定\'/>');
	$okButton.css({
		'width' : '80px',
		'height' : '32px',
		'margin-right' : '12px',
		'border':'1px solid #C1C1C1',
		'color':'#fff',
		'background':'#1C86EE'
	});

	// 确定按钮事件
	$okButton.on('click', function(event) {
		event.stopPropagation();
		var p = {};
		p.verifycode = $verifyInput.val()||'';
		if(p.verifycode == ''){
			_alert('请输入验证码',false);
			return;
		}
		$.ajax({
			url : _SECURITY_PROTECT_CHECK_VERIFY_URL,
			type : 'post',
			data : p,
			dataType : 'json',
			success : function(data, textStatus, XMLHttpRequest) {
				if (data && data.result) {
					// 关闭对话框
					if (successFunc) {
						try {
							successFunc();
						} catch (err) {
							console.log(err);
						}
					}
					$dialog.trigger('close-dialog');
				} else {
					_alert('验证码错误', false);
				}
			},
			error : function() {
			}
		});
	});
	$dialogFooter.append($cancelButton);
	$dialogFooter.append($okButton);

	hideProccessBar();
}